<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>区域设置</title>
<!-- 导入jquery核心类库 -->
<script type="text/javascript"
	src="${pageContext.request.contextPath }/js/jquery-1.8.3.js"></script>
<!-- 导入easyui类库 -->
<link rel="stylesheet" type="text/css"
	href="${pageContext.request.contextPath }/js/easyui/themes/default/easyui.css">
<link rel="stylesheet" type="text/css"
	href="${pageContext.request.contextPath }/js/easyui/themes/icon.css">
<link rel="stylesheet" type="text/css"
	href="${pageContext.request.contextPath }/js/easyui/ext/portal.css">
<link rel="stylesheet" type="text/css"
	href="${pageContext.request.contextPath }/css/default.css">
<script type="text/javascript"
	src="${pageContext.request.contextPath }/js/easyui/jquery.easyui.min.js"></script>
<script type="text/javascript"
	src="${pageContext.request.contextPath }/js/easyui/ext/jquery.portal.js"></script>
<script type="text/javascript"
	src="${pageContext.request.contextPath }/js/easyui/ext/jquery.cookie.js"></script>
<script
	src="${pageContext.request.contextPath }/js/easyui/locale/easyui-lang-zh_CN.js"
	type="text/javascript"></script>
<script type="text/javascript" src="${pageContext.request.contextPath }/js/jquery.ocupload-1.1.2.js"></script>

</head>
<body class="easyui-layout" style="visibility:hidden;">
	<div region="center" border="false">
    	<table id="grid"></table>
	</div>






	<div class="easyui-window" title="区域添加修改" id="addRegionWindow" collapsible="false" minimizable="false" maximizable="false" style="top:20px;left:200px">
		<div region="north" style="height:31px;overflow:hidden;" split="false" border="false" >
			<div class="datagrid-toolbar">
				<a id="save" icon="icon-save" href="#" class="easyui-linkbutton" plain="true" >保存</a>
			</div>
		</div>

		<div region="center" style="overflow:auto;padding:5px;" border="false">
			<form id="regionForm">
				<input type="hidden" name="id" />

				<table class="table-edit" width="80%" align="center">
					<tr class="title">
						<td colspan="2">区域信息</td>
					</tr>
					<tr>
						<td>省</td>
						<td><input type="text" name="province" class="easyui-validatebox" required="true"/></td>
					</tr>
					<tr>
						<td>市</td>
						<td><input type="text" name="city" class="easyui-validatebox" required="true"/></td>
					</tr>
					<tr>
						<td>区</td>
						<td><input type="text" name="district" class="easyui-validatebox" required="true"/></td>
					</tr>
					<tr>
						<td>邮编</td>
						<td><input type="text" name="postcode" class="easyui-validatebox" required="true"/></td>
					</tr>
					<tr>
						<td>简码</td>
						<td><input type="text" name="shortcode" class="easyui-validatebox" required="true"/></td>
					</tr>
					<tr>
						<td>城市编码</td>
						<td><input type="text" name="citycode" class="easyui-validatebox" required="true"/></td>
					</tr>
					</table>
			</form>
		</div>
	</div>

	<script type="text/javascript">

		//添加
		function doAdd(){
			$('#addRegionWindow').window("open");

			//清除form表单的信息
			$("#regionForm").form('clear')
		}

		//双击
		function doDblClickRow(rowIndex, rowData){
			$.ajax({
				url:'${pageContext.request.contextPath}/bcRegion/uPBcRegion.action',
				type:'post',
				data:{id:rowData.id},
				dataType:'json',
				success:function(obj){

					//显示到 form表单中
					$("#regionForm").form('load',obj);

					//打开窗口
					$("#addRegionWindow").window('open');
				}

			})

		}

		//修改
		function doView(){


			var datagrid = $("#grid").datagrid('getSelections');


			//判断长度


			if (datagrid.length==1){


				var  id;

				for (var i=0;i<datagrid.length;i++){
					id=datagrid[i].id;
				}

				$.ajax({
					url:'${pageContext.request.contextPath}/bcRegion/uPBcRegion.action',
					type:'post',
					data:{id:id},
					dataType:'json',
					success:function(obj){

						//显示到 form表单中
						$("#regionForm").form('load',obj);

						//打开窗口
						$("#addRegionWindow").window('open');
					}

				})


			}else if (datagrid.length<1) {
				$.messager.alert('提示','你还没有选中任何复选框','error');
			}else if (datagrid.length>1) {
				$.messager.alert("提示","只能选中一个复选框",'error');
				//清楚选中的复选框
				$("#grid").datagrid('unselectAll');
			}


		}

		//删除
		function doDelete(){
			var datagrid = $("#grid").datagrid('getSelections');

			if (datagrid.length<1){
				//显示提示信息
				$.messager.alert('提示',"你没有选中任何选项","error");
			} else{
				//得到选中选项的id
				var ids=new Array();

				for (var i=0;i<datagrid.length;i++){

					ids.push(datagrid[i].id);

				}

				//每个参数之间使用 , 分隔 得到 String字符串 使用ajax 传递

				var s = ids.join(",");


				$.ajax({
					url:'${pageContext.request.contextPath}/bcRegion/delBcRegion.action',
					type:'post',
					data:{ids:s},
					dataType:'json',
					success:function (obj) {
						$.messager.show({
							title:'消息提示',
							msg:'删除成功',
							timeout:1000,
							showType:'slide'
						});

						//刷新table表单
						$("#grid").datagrid('reload');

						//取消选中的复选框
						$("#grid").datagrid('unselectAll');

					}
				})
			}

		}

		//工具栏
		var toolbar = [ {
			id : 'button-edit',
			text : '修改',
			iconCls : 'icon-edit',
			handler : doView
		}, {
			id : 'button-add',
			text : '增加',
			iconCls : 'icon-add',
			handler : doAdd
		}, {
			id : 'button-delete',
			text : '删除',
			iconCls : 'icon-cancel',
			handler : doDelete
		}, {
			id : 'button-import',
			text : '导入',
			iconCls : 'icon-redo'
		}];
		// 定义列
		var columns = [ [ {
			field : 'id',
			checkbox : true,
		},{
			field : 'province',
			title : '省',
			width : 120,
			align : 'center'
		}, {
			field : 'city',
			title : '市',
			width : 120,
			align : 'center'
		}, {
			field : 'district',
			title : '区',
			width : 120,
			align : 'center'
		}, {
			field : 'postcode',
			title : '邮编',
			width : 120,
			align : 'center'
		}, {
			field : 'shortcode',
			title : '简码',
			width : 120,
			align : 'center'
		}, {
			field : 'citycode',
			title : '城市编码',
			width : 200,
			align : 'center'
		} ] ];


		//添加第二步
		$("#save").click(function (obj) {


		   //1.首先验证 信息是否写全

			if ($("#regionForm").form('validate')){
				//进入ajax
				$.ajax({
					url:'${pageContext.request.contextPath}/bcRegion/saveBcRegion.action',
					type:'post',
					data:$("#regionForm").serialize(),  //serialize() 得到得到是 全部书写的内容
					dataType:'json',
					success:function (obj) {

						if (obj.success){
							//关闭当前窗口
							$("#addRegionWindow").window('close');
							//刷新页面
							$("#grid").datagrid('reload')
							//提示添加成功
							$.messager.show({
								title:'消息提示',
								msg:'成功',
								timeout:1000,
								showType:'slide'
							});
							//清楚选中的复选框
							$("#grid").datagrid('unselectAll');



						} else{
							//关闭当前窗口
							$("#addRegionWindow").window('close');
							//提示添加失败
							$.messager.show({
								title:'消息提示',
								msg:'失败',
								timeout:1000,
								showType:'slide'
							})
						}
					}
				})
			}else{
				$.messager.alert("提示","请输入完整的信息","error")
			}

		});



		$(function(){


			// 先将body隐藏，再显示，不会出现页面刷新效果
			$("body").css({visibility:"visible"});


			// 收派标准数据表格
			$('#grid').datagrid( {
				iconCls : 'icon-forward',
				fit : true,
				border : false,
				rownumbers : true,
				striped : true,
				pageList: [10,20,50,100],
				pagination : true,
				toolbar : toolbar,
				url : "${pageContext.request.contextPath }/bcRegion/findPage.action",
				idField : 'id',
				columns : columns,
				onDblClickRow : doDblClickRow
			});




			// 添加、修改区域窗口
			$('#addRegionWindow').window({
				title: '添加修改区域',
				width: 400,
				modal: true,
				shadow: true,
				closed: true,
				height: 400,
				resizable:false
			});


			//绑定一键上传按钮
			$("#button-import").upload({
				action:"${pageContext.request.contextPath}/bcRegion/import.action",
				name:"excelFile",
				onComplete:function (response) {

					//刷新Table表单
					$("#grid").datagrid('reload');

					//提示导入成功
					$.messager.show({
						title:'消息提示',
						msg:'导入成功',
						timeout:1000,
						showType:'slide'
					})
				}
			});

		});


	</script>

</body>
</html>